<!-- @hadeer ahmed

this page takes the exercise id and displays text boxes for the user to enter the content of the
created exercise to give it to the method which creates this questions -->

#{extends 'main.html' /} #{set title:'Home' /}
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>adding questions</title>
<script>
	function generatenew() {
		var d = document.getElementById("div");
		d.innerHTML += "<p>choice:<input type='text' name='Choice'>";
	}
</script>
<script type="text/javascript">
	function checkNull() {
		if (lessoptions == true) {
			alert("you have entred less than 2 options !");
		}
	}
</script>
</head>

<body>
	#{ifnot theQuestions}

	<p>There Is No Question yet !!</p>
	#{/ifnot}

	<form>

		<p>ALL Questions:</p>


		#{list items:theQuestions, as:'question'}

		<ul>
			<li>${question.theQuestion}</li>
		</ul>
		#{list items:question.myChoices, as:'listchoices'}
		<ul>

			<input type="radio" name="choices" id="${listchoices.choice}" />${listchoices.choice}
			<br />

		</ul>
		#{/list} #{/list}

	</form>
	<form id="myForm" name="input" action="@{Exercises.createQuestion()}"
		method="post">
		<div id="div">
			<input style="visibility: hidden;" type="text" id="exerciseid"
				name="exerciseid" value=${exercise.id} /><br> <span
				style="color: #c00" class="error">#{error 'theQuestion' /}</span><br>
			the question :<input type="text" id="theQuestion" name="theQuestion" /><br>
			choice 1:<input type="text" id="Choice1" name="Choice1" /><br>
			choice 2:<input type="text" id="Choice2" name="Choice2" /><br>
			choice 3:<input type="text" id="Choice3" name="Choice3" /><br>
		</div>
		<span style="color: #c00" class="error">#{error 'Marks' /}</span><br>
		marks per question:<input type="text" id="Marks" name="Marks" /><br>


		<button name="addQuestion" id="addQuestion" type="submit"
			onclick="checkNull()" value="${exercise.id}">addQuestion</button>
		<button name="EndExercise" id="EndExercise" type="submit"
			onclick="checkNull()" value="${exercise.id}">EndExercise</button>

	</form>
	<button name="addoption" id="addoption" type="submit" value="new"
		onclick="generatenew()">add option</button>
</body>
</html>